<template>
  <view class="">
    <!-- 弹出层 -->
    <uni-popup ref="popup" :mask-click="true"  :animation="false">
      <view class="popup_body">
        <view class="popup_top">
          <view class="popup_top_title">选择仓位</view>
          <view class="popup_top_close" @click="close()">
            <i class="iconfont icon-shanchu"></i>
          </view>
        </view>
        <view class="popup_content">
          <uni-loading v-if="loading"></uni-loading>
          <!-- 扫描中 -->
          <view class="popup_content_scaning" v-else-if="isWaitScan">
            <input v-model="scanVal" :focus="isFocus" :adjust-position="false" @blur="isFocus=false"
                   @confirm="onScanSuccess" placeholder="等待扫码中....."
                   placeholder-class="popup_content_scaning_placeholder" />
          </view>
          <!-- 扫描结果 -->
          <block v-else>
            <view class="popup_content_info">
              <view class="barnCenter" v-if="stockLocation">
                {{stockLocation.stockName}}·{{stockLocation.locationName}}
              </view>
            </view>
            <!--  底部按钮  -->
            <view class="popup_content_btn">
              <button @click="confirm" class="popup_content_btn_item submit full" type="primary">选择</button>
            </view>
          </block>
        </view>
      </view>
    </uni-popup>
  </view>
</template>
<script>
import UniLoading from "../../vBase/components/uni-loading/uni-loading.vue"
export default {
  components: {
    UniLoading
  },
  data() {
    return {
      loading: false,
      isWaitScan: true,
      isFocus: false,
      scanVal: null,
	  stockNo: null,
	  stockLocation: null
    }
  },
  methods: {

    /**
     * 打开面板
     */
    open(stockNo) {
		if (!stockNo) {
		  uni.showToast({ title: '请选择仓库', icon: 'none' });
		  return;
		}
		let self = this
		// 初始化参数
		this.reset()
		this.stockNo = stockNo;
		this.scanVal = null
		this.$refs.popup.open('bottom')
		// #ifdef APP-PLUS
		plus.key.addEventListener('keydown', event => {
			self.isFocus = true
		});
		// #endif
    },

    /**
     * 关闭面板
     */
    close() {
      this.$refs.popup.close()
      this.isFocus = false
    },

    /**
     * 重新扫码
     */
    reset() {
      this.isWaitScan = true
      this.loading = false
      this.isFocus = true
	  this.stockLocation = null
    },

    /**
     * 监听扫码结果
     * @param e
     */
    async onScanSuccess(e) {
      let self = this
      if (self.loading) return
	  try {
		self.loading = true
		self.isFocus = false
		let res = await self.$api.getStockLocation({ stockNo: self.stockNo, locationNo: self.scanVal });
		if (!res.res) return
		self.handleMediaPlayer('success')
		self.isWaitScan = false
		this.stockLocation = res
	  } catch (e){
		this.handleMediaPlayer('error')
	  } finally {
        self.loading = false
        self.scanVal = null
		this.$nextTick(() => {
			self.isFocus = true
		})
	  }
    },
	
	/** 选择*/
	confirm() {
		this.$emit("confirm", this.stockLocation);
		this.close();
	}
  }
}
</script>
<style lang="scss" scoped>
@import "../../static/css/common";
.popup_body {
  height: 300px;
}

.barnCenter {
  font-size: 22px;
  font-weight: bold;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
  text-align: center;
  width: 100%;
}
</style>
